<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
    <style type="text/css">
        body{
            background-image: url("image/register_bg.png");
            background-repeat: no-repeat;
            background-position: center;
        }
#div1{
    height: 500px;
    width: 1000px;
    background-color: #FFFFFF;
    margin:100px auto;
    border: 11px solid #CCCCCC;

}
#div1_left{
    height: 500px;
    width: 200px;
    float: left;
    margin: 15px;
    /*border: 1px solid red;*/
}
#div1_middle {
    height: 500px;
    width: 500px;
    float: left;
    margin: 35px 15px;
    /*border: 1px solid red;*/
}
#div1_right{
    height: 500px;
    width: 200px;
    float: left;
    margin: 15px;
    /*border: 1px solid red;*/
    position: relative;
}
#p1{
    color: #ff9900;
    font-size: 23px;
}
 #p2{
     color:#333333;
     font-size:25px;
}
table tr{
    height: 40px;
    font-size: 20px;
}
table tr td:first-child{
    text-align: right;
        }
   table tr td:last-child{
       padding-left:40px;
        }
#text1,#email,#password,#tel,#date1,#text2,#text3{
    height: 30px;
    width: 240px;
    font-size: 18px;
    border-radius: 8px;
}
        #text1{
            width: 100px;
        }
#button{
    display: inline-block;
    background-color: #ff9900;
    border: #ff9900 ;
    height: 50px;
    width: 150px;
    margin: auto;
    font-size: 20px;

}  img{
            vertical-align: middle;
        }
#p3{
    color:#333333;
    font-size:15px;
    position: absolute;
    right: 0px;
}
a{
     color: #cc0000;
        }
    </style>
</head>
<body>
<div id="div1">
    <div id="div1_left">
        <p id="p1">新用户注册</p>
        <p id="p2">user register</p>
    </div>
    <div id="div1_middle">
       <table>
           <tr>
               <td>用户名</td>
               <td><input type="text" value="请输入用户名" id="text3"> </td>
           </tr>
           <tr>
               <td>密码</td>
               <td><input type="password" value="请输入用密码" id="password"> </td>
           </tr>
           <tr>
               <td>Email</td>
               <td><input type="email" value="请输入邮箱" id="email"> </td>
           </tr>
           <tr>
               <td>姓名</td>
               <td><input type="text" value="请输入姓名" id="text2"> </td>
           </tr>
           <tr>
               <td>手机号码</td>
               <td><input type="tel" value="请输入手机号码" id="tel"> </td>
           </tr>
           <tr>
               <td>性别</td>
               <td><input type="radio" > 男<input type="radio" >女</td>
           </tr>
           <tr>
               <td>出生日期</td>
               <td><input type="date" id="date1"> </td>
           </tr>
           <tr>
               <td>验证码</td>
               <td><input type="text" value="请输入验证码" id="text1"><img src="image/verify_code.jpg"> </td>
           </tr>
           <tr>
               <td></td>
               <td rowspan="2"><input type="button" value="注册" id="button"> </td>
           </tr>
       </table>
    </div>
    <div id="div1_right">
        <p id="p3">已有账号？
          <a href="#" >立即登录
        </p>
    </div>
</div>
</body>
</html>